<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<c:set var="userSession" value="${sessionScope.userBaseInfo}"/>
<%@include file="../base/frameBase.jsp" %>
<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>后台自定义名称</title>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">后台自定义名称</div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item"><a href="${ctx}/adminManage/index">控制台</a></li>
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item"><a href="javascript:;"> <img
                    src="http://t.cn/RCzsdCq" class="layui-nav-img">${userSession.nick}
            </a>
                <dl class="layui-nav-child">
                    <dd>
                        <a href="">基本资料</a>
                    </dd>
                    <dd>
                        <a href="">安全设置</a>
                    </dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="${ctx}/loginData/userExit">退出</a></li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll" lay-filter="demo2">
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul id="test11" class="layui-nav layui-nav-tree">
            </ul>
        </div>
    </div>

    <div class="layui-body layui-form">
        <div class="layui-tab tab" lay-filter="demo" lay-allowclose="true">
            <ul class="layui-tab-title"></ul>
            <div class="layui-tab-content"></div>
        </div>
    </div>

    <div class="layui-footer">
        <!-- 底部固定区域 -->
        <p>孔子曰：能行五者于天下，为仁矣。请问之。曰。恭宽信敏惠。恭则不侮。宽则得众。信则人任焉。敏则有功。惠则足以使人。————《论语》</p>
    </div>
</div>
<script>
    var ctx = "${ctx}";  //根路径
    var xtx = "${ctx}" + "/"; //带斜杠的路径
    var tg = "${userBaseInfo}";
    var authType = "${userBaseInfo.authType}";
    layui.use('element', function () {

        userLoginSessionCheck();
        initSystemInfo();
        initNavTree();
        $("#test11").find("span").remove();
        var element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
        element.render('nav');
        element.render('tab');
    });
    layui.use('element', function () {
        var $ = layui.jquery,
            element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
        var active = {
            tabAdd: function (tabTitle, url, id) {
                //新增一个Tab项
                element.tabAdd('demo', {
                    title: tabTitle,
                    content: '<iframe data-frameid="' + id + '" frameborder="0" name="content" scrolling="yes" width="100%" src="' + url + '"></iframe>',
                    id: id //实际使用一般是规定好的id，这里以时间戳模拟下
                })
                customRightClick(id);//绑定右键菜单
                frameWH();//计算框架高度
            }
            , tabChange: function (id) {
                //切换到指定Tab项
                element.tabChange('demo', id); //切换到：用户管理
                $("iframe[data-frameid='" + id + "']").attr("src", $("iframe[data-frameid='" + id + "']").attr("src"))//切换后刷新框架
            }
            , tabDelete: function (id) {
                element.tabDelete("demo", id);//删除
            }
            , tabDeleteAll: function (ids) {//删除所有
                $.each(ids, function (i, item) {
                    element.tabDelete("demo", item);
                })
            }

        };

        //展现新的content
        $(".layui-nav-item a").click(function () {
            var dataid = $(this);
            //解决包含子菜单,点击展开,而不打开页面的问题
            var rootNav = dataid.next("dl").length;
            if (rootNav > 0) {
                return;
            }
            if ($(".layui-tab-title li[lay-id]").length <= 0) {
                active.tabAdd(dataid.html(), dataid.attr("data-url"), dataid.attr("data-id"));
            } else {
                var isData = false;
                $.each($(".layui-tab-title li[lay-id]"), function () {
                    if ($(this).attr("lay-id") == dataid.attr("data-id")) {
                        isData = true;
                    }
                })
                if (isData == false) {
                    active.tabAdd(dataid.html(), dataid.attr("data-url"), dataid.attr("data-id"));
                }
            }
            active.tabChange(dataid.attr("data-id"));
        })

        //绑定右键菜单
        function customRightClick(id) {
            //取消右键
            $('.layui-tab-title li').on('contextmenu', function () {
                return false;
            })
            $('.layui-tab-title,.layui-tab-title li').click(function () {
                $('.rightmenu').hide();
            });
            //桌面点击右击
            $('.layui-tab-title li').on('contextmenu', function (e) {
                var popupmenu = $(".rightmenu");
                popupmenu.find("li").attr("data-id", id);
                l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX;
                t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY;
                popupmenu.css({left: l, top: t}).show();
                //alert("右键菜单")
                return false;
            });
        }

        function frameWH() {
            var h = $(window).height() - 41 - 10 - 60 - 10 - 44 - 10;
            $("iframe").css("height", h + "px");
        }

        $(window).resize(function () {
            frameWH();
        })

    });

    function initNavTree() {
        $.ajax({
            type: "get",
            url: "${ctx}/adminManageData/initLeftTreeNav?authType=" + authType,
            dataType: "json",
            async: false,
            contentType: "application/json;charset=utf-8",
            success: function (result) {
                createTreeNav(result);
            },
            error: function (req, error, errObj) {
            }
        });
    }

    function createTreeNav(result) {
        var tree = $("#test11");
        for (var navIndex in result) {
            var rootIcon = "&#xe857;";
            if (result[navIndex].icon != "" && result[navIndex].icon != null && result[navIndex].icon !== 'undefined') {
                rootIcon = result[navIndex].icon;
            }
            var rootNav = "<li class='layui-nav-item'>"
                + "<a data-url='" + xtx + result[navIndex].href + "' data-id='" + result[navIndex].id + "'>"
                + "<i class='layui-icon navIcon'>" + rootIcon + "</i>" + result[navIndex].title
                + "</a></li>";
            if (result[navIndex].children.length > 0) {
                rootNav = "<li class='layui-nav-item'><a data-id='" + result[navIndex].id + "'>"
                    + "<i class='layui-icon navIcon'>" + rootIcon + "</i>" + result[navIndex].title + "</a>";
                var childsNav = result[navIndex].children;
                var childNavs = "";
                var dlChildNav = "<dl class='layui-nav-child'>"
                for (var childIndex in childsNav) {
                    var childIcon = "&#xe857;"
                    if (childsNav[childIndex].icon != "" && childsNav[childIndex].icon != null && childsNav[childIndex].icon !== 'undefined') {
                        childIcon = childsNav[childIndex].icon;
                    }
                    var childNav = "<dd><a data-url='" + xtx + childsNav[childIndex].href + "' data-id='" + childsNav[childIndex].id + "'><i class='layui-icon navIcon'>"
                        + childIcon + "</i>" + childsNav[childIndex].title + "</a></dd>";
                    childNavs = childNavs + childNav;
                }
                tree.append(rootNav + dlChildNav + childNavs + "</dl></li>");
            } else {
                tree.append(rootNav);
            }
        }
    }

    //用户session校验
    function userLoginSessionCheck() {
        if (tg == "") {
            alert("请先登录！");
            window.location.href = '${ctx}/login/loginIndexPage';
        }

    }

    function initSystemInfo() {
        debugger;
        $.ajax({
            type: "get",
            url: "${ctx}/adminManageData/initConfigInfo",
            dataType: "json",
            async: false,
            contentType: "application/json;charset=utf-8",
            success: function (result) {
                debugger;
                var data = result;
                if (data.code == "00000") {
                    debugger;
                    $("#system-name").html(data.data.name);
                    $("#tl-system-name").html(data.data.title + "-login");
                }

            },
            error: function (req, error, errObj) {
            }
        });
    }
</script>
<%@include file="../base/frameFoot.jsp" %>